<template>
  <!--  <n-button style="z-index: 99999" @click="test">sadfads</n-button>-->
  <NConfigProvider
    v-if="!isLock"
    :locale="zhCN"
    :theme="getDarkTheme"
    :theme-overrides="getThemeOverrides"
    :date-locale="dateZhCN"
  >
    <AppProvider>
      <RouterView />
    </AppProvider>
  </NConfigProvider>
  <transition v-if="isLock && $route.name !== 'login'" name="slide-up">
    <LockScreen />
  </transition>
</template>

<script lang="ts" setup>
import { computed, onMounted, onUnmounted } from "vue";
import { useLockscreenStore } from "@/store/modules/lockscreen";
import { useRoute } from "vue-router";
import { useDesignSettingStore } from "@/store/modules/designSetting";
import { lighten } from "@/utils/index";
import {LockScreen } from "@/components/Lockscreen"
import {AppProvider} from "@/components/Application"
const route = useRoute();
import { zhCN, dateZhCN, darkTheme } from 'naive-ui';
const useLockscreen = useLockscreenStore();
const designStore = useDesignSettingStore();
const isLock = computed(() => useLockscreen.isLock);
const lockTime = computed(() => useLockscreen.lockTime);

/**
 * @type import('naive-ui').GlobalThemeOverrides
 */
const getThemeOverrides = computed(() => {
  const appTheme = designStore.appTheme;
  const lightenStr = lighten(designStore.appTheme, 6);
  return {
    common: {
      baseColor: "#FFFFFF",
      primaryColor: lightenStr,
      primaryColorHover: lightenStr,
      primaryColorPressed: lightenStr

    },

    LoadingBar: {
      colorLoading: appTheme
    }
  };
});

const getDarkTheme = computed(() => (designStore.darkTheme ? darkTheme : undefined));

let timer;
const timekeeping = () => {
  clearInterval(timer);
  if (route.name == "login" || isLock.value) return;
  // 设置不锁屏
  useLockscreen.setLock(false);
  // 重置锁屏时间
  useLockscreen.setLockTime();
  timer = setInterval(() => {
    // 锁屏倒计时递减
    useLockscreen.setLockTime(lockTime.value - 1);
    if (lockTime.value <= 0) {
      // 设置锁屏
      useLockscreen.setLock(true);
      return clearInterval(timer);
    }
  }, 1000);
};

onMounted(() => {
  document.addEventListener("mousedown", timekeeping);
});

onUnmounted(() => {
  document.removeEventListener("mousedown", timekeeping);
});
</script>

<style lang="less">
@import 'styles/index.less';
</style>
